import {IconImg} from '@/components/images'
import {CItem} from '@/components/item'
import {View} from '@tarojs/components'

export const UserItem: React.FC<{
  icon: string
  title: string
  desc: string
  onClick?: Function
}> = ({icon, title, desc, onClick}): JSX.Element => {
  return (
    <CItem
      style={{
        height: '136rpx',
        padding: '44rpx 32rpx !important',
        justifyContent: 'space-between'
      }}
      onClick={() => onClick && onClick()}
    >
      <View className="flex-1 h-full flex items-center">
        <IconImg
          imgName={icon}
          style={{
            width: '48rpx',
            height: '48rpx'
          }}
        ></IconImg>
        <View className="h-full ml-8 flex-1 flex items-center justify-between">
          <View className="hanzi h-full text-14 font-medium flex items-center truncate mr-6">
            {title}
          </View>
          <View className="hanzi flex-1 h-full text-12 text-xx_text flex items-center justify-end truncate mr-6">
            {desc}
          </View>
        </View>
      </View>
    </CItem>
  )
}
